{% extends "base.html" %}

{% block breadcrumb %}{{ block.super }}{% endblock %}

{% block content %}
<div class="ui-widget-content ui-corner-all">
<table cellspacing="0">
 <thead>
  <tr class="ui-widget-header">
   <th align="left" width="5%"><input type="checkbox" id="action-toggle" /></th>
   <th align="left" width="15%">MAC Address</th>
   <th align="left" width="40%">Description</th>
   <th align="left" width="35%">Model</th>
   <th align="center" width="5%">Enabled</th>
  </tr>
 </thead>
 <tbody>
 {% for device in devices.object_list %}
  <tr>
   <td align="left"><input type="checkbox" value="1" name="_selected-action" /></td>
   <td align="left"><a href="{{ device.id }}/">{{ device.mac_address }}</a></td>
   <td align="left">{{ device.description }}</td>
   <td align="left">{{ device.model }}</td>
   <td align="center"><img src="{{ SITE_ROOT }}/images/icons/{% if device.enabled %}tick.png{% else %}cross.png{% endif %}" alt="{{ device.enabled }}" /></td>
  </tr>
 {% endfor %}
 </tbody>
</table>
</div>
<div class="pagination">
 <span class="step-links">
  {% if devices.has_previous %}
  <a href="?page={{ devices.previous_page_number }}">Prev</a>
  {% endif %}
  <span class="current">Page {{ devices.number }} of {{ devices.paginator.num_pages }}</span>
  {% if devices.has_next %}
  <a href="?page={{ devices.next_page_number }}">Next</a>
  {% endif %}
 </span>
</div>
{% endblock %}
